<template>
  <d2-container>
    <el-row :gutter="20">
      <el-col :span="24">
        <el-form ref="queryForm" :model="queryParams" size="medium">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>选择业务</span>
            </div>
            <el-row :gutter="20">
              <el-col :span="24">
                <el-form-item prop="type">
                  <el-select v-model="queryParams.type" placeholder="请选择" @change="handleQuery" style="width:30%">
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
          <el-card class="box-card" style="margin-top: 15px">
            <el-row :gutter="20">
              <el-col :span="12">
                <el-form-item label="工单名称:" prop="name" label-width="100px">
                  <el-input v-model="queryParams.name">
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="工单名称:" prop="name" label-width="100px">
                  <el-input>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
        </el-form>
      </el-col>
    </el-row>
  </d2-container>
</template>

<script>

export default {
  name: 'new',
  components: {
  },
  provide: {
  },
  data () {
    return {
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        id: undefined,
        type: undefined
      },
      // 归属项目选项
      form: [],
      options: [
        { id: '0', value: '0', label: '服务上线' },
        { id: '1', value: '1', label: 'sql执行' }
      ]
    }
  },
  methods: {
    /** 内部跳转 */
    gotoRoute (route) {
      this.$router.push(route)
    },
    /** 查询参数列表 */
    getList () {

    },

    handleQuery () {
      console.log(this.queryParams.type)
    }
  }
}
</script>
